﻿<UserControl x:Class="Chapters.Chapter12.KeyFrameAnimation"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
	<UserControl.Resources>
		<Storyboard x:Key="KeyFrameAnimation">
			<ColorAnimationUsingKeyFrames Duration="0:0:7"
																		Storyboard.TargetName="KeyFrameEllipse"
																		Storyboard.TargetProperty="Fill.(SolidColorBrush.Color)">
				<LinearColorKeyFrame KeyTime="0:0:0"
														 Value="White" />
				<LinearColorKeyFrame KeyTime="0:0:1"
														 Value="Violet" />
				<LinearColorKeyFrame KeyTime="0:0:2"
														 Value="Indigo" />
				<LinearColorKeyFrame KeyTime="0:0:3"
														 Value="Blue" />
				<LinearColorKeyFrame KeyTime="0:0:4"
														 Value="Green" />
				<LinearColorKeyFrame KeyTime="0:0:5"
														 Value="Yellow" />
				<LinearColorKeyFrame KeyTime="0:0:6"
														 Value="Orange" />
				<LinearColorKeyFrame KeyTime="0:0:7"
														 Value="Red" />
			</ColorAnimationUsingKeyFrames>
		</Storyboard>
	</UserControl.Resources>
	<DockPanel>
		<StackPanel Orientation="Horizontal"
								DockPanel.Dock="Top"
								HorizontalAlignment="Right">
			<Button x:Name="_keyframeAnimation">Play Animation</Button>
		</StackPanel>
		<Ellipse x:Name="KeyFrameEllipse"
						 Fill="LightGray"
						 Stroke="Gray" />
	</DockPanel>
	<UserControl.Triggers>
		<EventTrigger RoutedEvent="Button.Click"
									SourceName="_keyframeAnimation">
			<BeginStoryboard Storyboard="{StaticResource KeyFrameAnimation}" />
		</EventTrigger>
	</UserControl.Triggers>
</UserControl>
